<template>
  <view class="button-container">
    <view class="row">
      <button class="btn" @click="handleSave">暂存</button>
        <button 
            v-if="curPageNum < totalPages"
            class="btn" 
            @click="handleNext"
          >
            下一步（{{curPageNum}}/{{totalPages}}）
          </button>
          <button 
            v-else
            class="btn" 
            @click="handleSubmit"
          >
              保存并提交核查表
            </button>
    </view>
    <view class="row">
      <button class="btn2" v-if="curPageNum > 1"  @tap="$emit('backToHome')">返回核查表首页</button>
      <button 
        class="btn2" 
        v-if="curPageNum > 1" 
        @click="$emit('pageClick', 0)"
      >
        上一页
      </button>
    </view>
    <view style="height: 80px;"></view>
  </view>
</template>

<script>
export default {
  props: {
    pageCount: {
      type: Number,
      default: 5 // 建议默认值改为5，与问题描述一致
    },
    totalNum: Number,
    curPageNum: Number
  },
  computed: {
    totalPages() {
      return Math.ceil(this.totalNum / this.pageCount)
    }
  },
  methods: {
	  // 统一保存处理方法
 handleSave() {
	    
	      this.$emit('save') // 触发保存事件
	    },
    handleNext() {
      this.$emit('pageClick', 1)
    },
    handleSubmit() {
      this.$emit('submit') // 新增提交事件
    }
  }
}
</script>

<style scoped>
	.button-container {
		padding: 20rpx;
	}

	.btn {
		flex: 1;
		/* 等分宽度 */
		margin: 0 10rpx;
		/* 左右间距 */
		padding: 5rpx 0;
		border-radius: 12rpx;
		background: #3282ff;
		color: #333;
		font-size: 20rpx;
		color: #ffffff;
	}
	
	.btn2 {
		flex: 1;
		/* 等分宽度 */
		margin: 0 10rpx;
		/* 左右间距 */
		padding: 5rpx 0;
		border-radius: 12rpx;
		background: #f5512d;
		color: #333;
		font-size: 20rpx;
		color: #ffffff;
	}

	.primary {
		background: #007AFF;
		color: white;
		border: none;
	}

	/* 行容器 */
	.row {
		display: flex;
		justify-content: space-between;
		/* 平分剩余空间[5](@ref) */
		margin-bottom: 20rpx;
		/* 行间距 */
	}

	.disabled {
		background: #e0e0e0 !important;
		color: #999 !important;
		cursor: not-allowed;
	}

	.pageUpBtn {

		margin-left: 0px;
		background-color: white;
		border-radius: 4px;
		border-width: 1px;
		border-color: #999999;
		padding: 4px 6px;
		color: #333333;
		font-size: 15px;
	}
</style>